<%@ page contentType="text/html;charset=UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="shiro" uri="http://shiro.apache.org/tags" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %> 
<%@ taglib prefix="tags" tagdir="/WEB-INF/tags" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"/>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
    
	
	<title>_登记线下订单</title>
	<script type="text/javascript">
	
	//页面初始
    $(function() {
            $("#inputForm").validate();
			
			$("#_customerCode").val("");
			$("#_customerCodeName").val("");
			
			$("#_warehouseCode").val("");
			$("#_warehouseCodeName").val("");
    });
	
	
	//查询商品
	function skuQuery(){
	
	    var sku=$("#sku").val().trim();
	    var customerCode=$("#_customerCode").val();
	    var warehouseCode=$("#_warehouseOutCode").val();
	    
	    if(customerCode==''){
	       alert("请选择商家！");
	       $("#_customerCode").focus();
	       return;
	    }
	    
	    if(warehouseCode==''){
	       alert("请选择出货仓库！");
	       $("#_warehouseOutCode").focus();
	       return;
	    }
	    
	    $("#sku_content").html('');
	    
	    $.ajax({
			type : 'post',
			url : '${ctx}/outstorageBill/ajaxQuerySku',
			data : {
				customerCode:customerCode,
				warehouseCode:warehouseCode,
				sku:sku
			},
			dataType : 'json',
			success : function(data) {
				var stockList=data.stockList;
				var str="";
				$.each(stockList,function(i,stock){
				
					str+="<tr>";
					str+="<td>"+(i+1)+"</td>";
					str+="<td id='customerCode_"+stock.id+"'>"+stock.customer.customerCode+"</td>";
					str+="<td id='warehouseCode_"+stock.id+"'>"+stock.warehouseCode+"</td>";
					str+="<td id='sku_"+stock.id+"'>"+stock.sku+"</td>";
					str+="<td id='salesNum_"+stock.id+"'>"+stock.salesNum+"</td>";
					
					//判断是否已经添加
					var flag='1';
					$("[name='add']").each(function(i){
					    var tempId=this.id;
					    if(tempId==stock.id){
					        flag='2';
					    }
					});
					if(flag=='1'){
					   str+="<td>"+"<input type='button' class='btn btn-info'  value='添加' id='btn_"+stock.id+"' onclick='add("+stock.id+")'>"+"</td>";
					}else if(flag=='2'){
					   str+="<td>"+"<input type='button' class='btn'  value='已添加'  id='btn_"+stock.id+"'>"+"</td>";
					}
					
					str+="</tr>";
				});
				$("#sku_content").html(str);
			},
			error:function() {
				alert("网络繁忙，请稍后重试...");
			}
		}); 
	}
	
	//添加商品
	function add(id){
	    var customerCode=$("#customerCode_"+id).html();
	    var warehouseCode=$("#warehouseCode_"+id).html();
	    var sku=$("#sku_"+id).html();
	    var salesNum=$("#salesNum_"+id).html();
	    
	    var trElement="";
	    trElement+="<tr name='add' id='"+id+"'>";
	    trElement+="<td id='add_customerCode_"+id+"'>"+customerCode+"</td>";
	    trElement+="<td id='add_warehouseCode_"+id+"'>"+warehouseCode+"</td>";
	    trElement+="<td id='add_sku_"+id+"'>"+sku+"</td>";
	    trElement+="<td>"+salesNum+"</td>";
	    trElement+="<td ><input type='text' id='add_num_"+id+"'/><span  id='add_message_"+id+"' style='color:red;'></span></td>";
	    trElement+="<td><input type='button' class='btn btn-info' value='取消' onclick='del("+id+");'/></td>";
	    trElement+="</tr>";
	    
	    $("#add_info").append(trElement);
	    
	    var btn=$("#btn_"+id);
	    btn.attr("disabled",true);
           btn.attr("class","btn");
           btn.val("已添加");
	    
	    $("#nodata").hide();
	}
	
	//取消商品
	function del(id){
	    $("#"+id).remove();
	    var btn=$("#btn_"+id);
	    btn.attr("disabled",false);
        btn.attr("class","btn  btn-info");
        btn.bind("click","add("+id+")");
        btn.val("添加");
	}
	
	
	//创建JSON对象
	function createObj(customerCode,warehouseCode,sku,num){
	    return {
	        customerCode:customerCode,
	        warehouseCode:warehouseCode,
	        sku:sku,
	        num:num
	    };
	}
	function changeCustomerCode(item){
		customerCode=item.value;
		if(customerCode==''){
			return false;
		}
		$("#_customerCode").val(customerCode);
		$("#_customerCodeName").val( $("#_customerCode_1").find("option:selected").text() );
	}
	  /* //级联商家仓库
	  function ajaxAreaGroup(item) {
		    $("#_warehouseCode_1").html("<option value=''></option>");
			customerCode=item.value;
			if(customerCode==''){
				return false;
			}
			
			$("#_customerCode").val(customerCode);
			$("#_customerCodeName").val( $("#_customerCode_1").find("option:selected").text() );
			
			$.ajax({
				type : 'post',
				url : '${ctx}/areaGroup/ajaxAreaGroup',
				data : 'customerCode=' + customerCode,
				dataType : 'json',
				success : function(data) {
				  var tempString="<option value=''></option>";
					if (data.status == "1") {
						$.each(data.content,function(i){
						    tempString+="<option value="+data.content[i].groupCode+">"+data.content[i].groupName;
						});
					}else if (data.status == "2") {
						$.each(data.content.restAreaGroupDtos,function(i){
						    tempString+="<option value="+data.content.restAreaGroupDtos[i].areagroupCode+">"+data.content.restAreaGroupDtos[i].areagroupName;
						});
					} else {
						alert(data.content);
					}
	                      $("#_warehouseCode_1").html(tempString);
				},
				error : function() {
					alert("获取信息错误！");
				}
			});
		} */
		
		
		function warehouseChange(item){
		    $("#_warehouseOutCode").val( $("#_warehouseCode_1").val() );
			$("#_warehouseOutName").val( $("#_warehouseCode_1").find("option:selected").text() );
		}
		
		//创建订单
		function createBill(){
		
		   //////////////////////////////////验证订单信息///////////////////////////
		   var customerCode=$("#_customerCode_1").val();
		   if(customerCode==''){
		         alert("请选择商家");
		         return;
		   }
		   var warehouseCode=$("#_warehouseCode_1").val();
		   if(warehouseCode==''){
		         alert("请选择仓库");
		         return;
		   }
		   var companyCode=$("#_companyCode").val();
		   if(companyCode==''){
		         alert("请选择快递公司");
		         return;
		   }
		   
		   var remark=$("#_remark").val().trim();
		   if(remark==''){
		         alert("请填写备注信息");
		         return;
		   }
		   
		   var fromName=$("#_fromName").val().trim();
		   if(fromName==''){
		         alert("请填写寄件人姓名");
		         return;
		   }
		   
		   var fromTel=$("#_fromTel").val().trim();
		   if(fromTel==''){
		         alert("请填写寄件人联系电话");
		         return;
		   }
		   
		   var fromAddress=$("#_fromAddress").val().trim();
		   if(fromAddress==''){
		         alert("请填写寄件地址");
		         return;
		   }
		   
		   var toName=$("#_toName").val().trim();
		   if(toName==''){
		         alert("请填写收件人姓名");
		         return;
		   }
		   
		   var toTel=$("#_toTel").val().trim();
		   if(toTel==''){
		          alert("请填写收件人联系电话");
		          return;
		   }
		   
		   var toAddress=$("#_toAddress").val().trim();
		   if(toAddress==''){
		         alert("请填写收件地址");
		         return;
		   }
		   
		    var btn=$("#btn_createBill");
		    btn.attr("disabled",true);
		    btn.attr("class","btn");
		   
		    ///////////////////////////商品信息//////////////////////////////////
		    var jsonArray=[];
		    var flag=true;
		    var flag_color=true;
		    
		    var customerCode=$("#_customerCode").val();
		    var warehouseCode_out=$("#_warehouseOutCode").val();
		    
		    //检查数据，并创建json对象
		    $("[name='add']").each(function(i){
		       var id=this.id;
		       var _customerCode=$("#add_customerCode_"+id).html();
		       var _warehouseCode=$("#add_warehouseCode_"+id).html();
		       var _sku=$("#add_sku_"+id).html();
		       var _num=$("#add_num_"+id).val().trim();
		       
		       if( isNaN(_num) || _num==''){
	               $("#add_message_"+id).html("请输入整数!");
	               flag=false;
	           }else{
	               $("#add_message_"+id).html("");
	           }
	           
	           if(_customerCode!=customerCode || _warehouseCode!=warehouseCode_out ){
	                $("#"+id).attr("bgcolor","yellow");
	                flag_color=false;
	           }else{
	                $("#"+id).attr("bgcolor",""); 
	           }
	           
	           var obj=createObj(_customerCode,_warehouseCode,_sku,_num);
	           jsonArray.push(obj);
	           
		    });
		    
		    if(jsonArray.length==0){
		       alert("请选择出库商品！");
		       btn.attr("disabled",false);
		       btn.attr("class","btn btn-primary");
		       return;
		    }
		    
		    if(flag==false || flag_color==false){
		      btn.attr("disabled",false);
		      btn.attr("class","btn btn-primary");
		      return;
		    }
		    
		    var jsonList= eval(jsonArray); 
		    var jsonText= JSON.stringify(jsonList);
		   
		   
		   $.ajax({
				type : 'post',
				url : '${ctx}/ulorder/ajaxCreateBill',
				data:{
				    customerCode:customerCode,
				    warehouseCode:warehouseCode,
					companyCode:companyCode,
					
					fromName:fromName,
					fromTel:fromTel,
					fromAddress:fromAddress,
					
					toName:toName,
					toTel:toTel,
					toAddress:toAddress,
					
					jsonText:jsonText
				},
				dataType : 'json',
				success : function(data) {
				
				      var msg=data.msg;
				      if(msg=="error_goods"){
				           var result=data.content;
					       var skuArray=result.split(",");
					       for(var i=0; i<skuArray.length;i++){
					          var sku=skuArray[i];
					          $("[name='add']").each(function(i){
			                         var id=this.id;
			                         var _sku=$("#add_sku_"+id).html();
			                         if(sku==_sku){
			                            $("#"+id).attr("bgcolor","yellow");
			                            $("#add_message_"+id).html("库存不满足！");
			                         }
			                         
			                  });
					       }
				      
				      }else if(msg=="success"){
				          window.alert("完成入库点收！！请按“确定”继续。"); 
				          location.href='${ctx}/ulorder/v2_toUlorderMgrPage';
				      }
				      
				      btn.attr("disabled",false);
	    		      btn.attr("class","btn btn-warning");
				    
				},
				error : function() {
					btn.attr("disabled",false);
		    		btn.attr("class","btn btn-warning");
					alert("网络繁忙，请稍后重试...");
				}
			});
		
		}
		
		//创建JSON对象
		function createObj(customerCode,warehouseCode,sku,num){
		    return {
		        customerCode:customerCode,
		        warehouseCode:warehouseCode,
		        sku:sku,
		        num:num
		    };
		}
	
    </script>
</head>

<body>
	  <table id="contentTable" class="table  table-bordered table-condensed">
    <thead>
		<th style='vertical-align: middle;background-color: #6699CC;color: white;font-size: medium;' colspan="13" bgcolor="#8EB4CB">
		线下订单登记
		<input type="button" id="btn_createBill" value="创建订单" class="btn btn-primary" style="margin-left:10px;" onclick="createBill();">
		</th>
	</thead>
		
  <tbody>
  <tr><td>

    <div class="tabbable">
    
	  	   <ul class="nav nav-tabs">
			   <li class="${tab1}"><a href="#tab1" data-toggle="tab">订单信息</a></li>
			   <li class="${tab2}"><a href="#tab2" data-toggle="tab">选择商品</a></li>
		   </ul>
		
		   <div class="tab-content">
		   
		        <!-- 订单信息 -->
				<div class="tab-pane ${tab1}" id="tab1">
				  
				    <!-- 发货信息 -->
					<table class="table table-striped table-bordered table-condensed" style="margin-top: 0px;">
						<thead>
							<th style="vertical-align: middle; color: white; " colspan="6" bgcolor="#8EB4CB">发货信息 ：</th>
						</thead>
						<tr>
						   <td style="vertical-align: middle;width: 90px; text-align: center;">商家名称：</td>
						   <td style="width: 200px;">
						        <select id="_customerCode_1" class="input-medium" onchange="ajaxAreaGroup(this,'_warehouseCode_1');changeCustomerCode(this)" style="margin-bottom:0px!important;">
									<option value=""></option>
									<c:forEach items="${customerList}" var="customer">
										<option value="${customer.customerCode}" >${customer.customerName}</option>
									</c:forEach>
								</select>
						   </td>
						   
						   <td style="vertical-align: middle;width: 90px; text-align: center;">发货仓库：</td>
						   <td style="width: 200px;">
						      <select id="_warehouseCode_1"  class="input-medium"  style="margin-bottom:0px!important;" onchange="warehouseChange(this);">
								<option value=""></option>
								<c:forEach items="${warehouseList}" var="w" >
								   <option value="${w.groupCode}">${w.groupName}</option>
							   </c:forEach>
							</select>
						   </td>
						   
						   <td style="vertical-align: middle;width: 90px; text-align: center;">重量（g）：</td>
						   <td>
						      <input  type="text" id="_weight" style="height: 15px!important;margin-bottom:0px!important;" disabled="disabled"/>
						   </td>
					   </tr>
					   <tr>
						   <td style="vertical-align: middle;width: 90px; text-align: center;">快递公司：</td>
						   <td style="width: 200px;">
						       <select class="input-medium"  id="_companyCode" style="margin-bottom:0px!important;">
							        <option value=""></option>
									<c:forEach items="${cmpList}" var="cmp">
										<option value="${cmp.companyCode}"
										  <c:if test="${param._companyCode eq cmp.companyCode }">selected=selected</c:if>
										>${cmp.companyName}</option>
									</c:forEach>
							</select> 
						   </td>
						   <td style="vertical-align: middle;width: 90px; text-align: center;" >快递单号：</td>
						   <td style="width: 200px;">
						      <input  type="text" id="_expressNo" class="input-medium" disabled="disabled" style="height: 15px!important;margin-bottom:0px!important;"/>
						   </td>
						   <td colspan="2"></td>
					   </tr>
					   
					   <tr>
						   <td style="vertical-align: middle;width: 90px; text-align: center;">备注信息：</td>
						   <td colspan="5">
						      <textarea id="_remark" style="width: 500px; height: 50px;"></textarea>
						   </td>
					   </tr>
					</table>
					
					<!-- 寄件信息 -->
					<table class="table table-striped table-bordered table-condensed" style="margin-top: 0px;">
						<thead>
							<th style="vertical-align: middle; color: white; " colspan="6" bgcolor="#8EB4CB">寄件信息：</th>
						</thead>
						<tr>
						   <td style="vertical-align: middle;width: 90px; text-align: center;">寄件人姓名：</td>
						   <td style="width: 200px;">
						       <input  type="text" id="_fromName" class="input-medium" style="height: 15px!important;margin-bottom:0px!important;"/>
						   </td>
						  <td style="vertical-align: middle;width: 90px; text-align: center;">联系人电话：</td>
						   <td style="width: 200px;">
						       <input  type="text" id="_fromTel" class="input-medium" style="height: 15px!important;margin-bottom:0px!important;"/>
						   </td>
						   
						   <td style="vertical-align: middle;width: 90px; text-align: center;" >详细地址：</td>
						   <td>
						      <input  type="text" id="_fromAddress" style="height: 15px!important;margin-bottom:0px!important; width: 300px;"/>
						   </td>
					   </tr>
					</table>
					
					<!-- 收件信息 -->
					<table class="table table-striped table-bordered table-condensed" style="margin-top: 0px;">
						<thead>
							<th style="vertical-align: middle; color: white; " colspan="6" bgcolor="#8EB4CB">收件信息：</th>
						</thead>
						<tr>
						   <td style="vertical-align: middle;width: 90px; text-align: center;">收件人姓名：</td>
						   <td style="width: 200px;">
						       <input  type="text" id="_toName" class="input-medium" style="height: 15px!important;margin-bottom:0px!important;"/>
						   </td>
						   
						    <td style="vertical-align: middle;  width: 90px; text-align: center;">联系人电话：</td>
						   <td style="width: 200px;">
						       <input  type="text" id="_toTel" class="input-medium" style="height: 15px!important;margin-bottom:0px!important;"/>
						   </td>
						   <td style="vertical-align: middle; width: 90px; text-align: center;" >详细地址：</td>
						   <td>
						      <input  type="text" id="_toAddress"  style="height: 15px!important;margin-bottom:0px!important; width: 300px;"/>
						   </td>
					   </tr>
					</table>
					
				</div>
				
				<!-- 选择商品-->
				<div class="tab-pane ${tab2}" id="tab2">
				
				<form class="form-search" >
				<table id="contentTable" class="table  table-bordered table-condensed">
				    <thead>
						<th style="vertical-align: middle; color: white;" colspan="13" bgcolor="#8EB4CB">选中的商品</th>
					</thead>
					<thead><tr>
					    <th>商家</th>
					    <th>仓库</th>
					    <th>sku</th>
					    <th>可用库存</th>
					    <th>出库数量</th>
						<th>操作</th>
					</tr></thead>
					<c:if test="${empty billList or billList.size() eq 0}">
				       <tr id="nodata"><td colspan="6" height="50" style="vertical-align:middle; text-align: center;color: gray;font-size: 20px;">无已选商品</td></tr>
				    </c:if>
					<tbody id="add_info"></tbody>
			    </table>
			    </form>
			    
				<!-- 商品查询 -->
				<form class="form-search">
				<table id="contentTable" class="table table-striped table-bordered table-condensed">
				    <thead>
						<th style="vertical-align: middle; color: white; " colspan="13" bgcolor="#8EB4CB">商品查询</th>
					</thead>
					
					<tr><td colspan="6">
					    
					     <label style="margin-left: 10px;">商家名称：</label>
					     <input  type="text" id="_customerCodeName" class="input-medium" style="height: 15px!important;margin-bottom:0px!important;" readonly="readonly"/>
					      <input type="hidden" id="_customerCode" />
						
					   <label style="margin-left: 10px;" >出货仓库：</label>
					   <input  type="text" id="_warehouseOutName" class="input-medium" style="height: 15px!important;margin-bottom:0px!important;" readonly="readonly"/>
					   <input type="hidden" id="_warehouseOutCode" />
					
					    <label>SKU编码：</label> 
						<input type="text"  id="sku"  class="input-medium" />
					    <button type="button" class="btn btn-info" style="margin-left: 10px;" onclick="skuQuery();">搜索</button>
			        </td></tr>
					
					<thead><tr>
					    <th>序号</th>
					    <th>商家</th>
					    <th>仓库</th>
					    <th>sku</th>
					    <th>可用库存</th>
						<th>操作</th>
					</tr></thead>
					<tbody id="sku_content">
					</tbody>
				</table>
				</form>
				
	         </div>
	         
	         
	     </div>
	 </div>
    
    </td></tr>
    </tbody>
  </table>
	
</body>
</html>
